<!DOCTYPE html>
<html lang="zh-cn">
    <head>
        <meta charset="utf-8">
        <title>Rainy Day – 逼真的雨滴效果</title>
        <style media="screen">
            body {
                overflow: hidden;
                height: 100%;
                margin: 0;
                padding: 0;
            }

            img {
                width: 100%;
                height: 100%;
            }
        </style>
        <script src="js/jquery-1.11.1.js"></script>
        <script src="js/rainyday.js"></script>
    </head>
    <body onload="run()">
        <img id="background" alt="background" src="img/4%20(1).jpg" />
    </body>


    <script>
        function run() {
            var image = document.getElementById('background');
            image.onload = function() {
                var engine = new RainyDay({
                    image: this,
                    blur:10

                });
                //engine.rain([ [3, 2, 2] ], 100);

               engine.rain(
                    [
                        [1, 0, 10],         // 加10滴1号的。。。
                        [1, 6, 1]           // ... 一滴1-6号的。。。
                    ],
                    10);  //每隔 10 毫秒






            };
            image.crossOrigin = 'anonymous';

        }
    </script>
</html>
